﻿@{
    ViewBag.Title = "Potential Rentals";
}

<script type="text/javascript">
    $(document).ready(function () {
        $("#create-rental-content").hide();
        $("span.create-rental").click(function () {
            if ($("#sidebar").is(":hidden")) {
                $("#sidebar").show("slow");
                $("#sidebar-show").toggle();
            }
            toggleContentLeft();
        });
        $("span.find-rentals").click(function () {
            $("#all-rentals").slideToggle("slow");
        });
    });

    function toggleContentLeft() {
        $("#user-rentals").slideToggle("slow");
        $("#create-rental-content").slideToggle("slow");

        /*
        if ($("#create-rental-content").is(":visible")) {
            $(".create-rental a").text("View Your List");
        }
        else {
            $(".create-rental a").text("Add New Rental");
        }
        */
    }

    function toggleSidebar() {
        $("#sidebar").toggle("slow");
        $("#sidebar-show").toggle();
    }

    function refreshLists() {
        $("#user-rentals").load("/Rental/UserList");
        $("#all-rentals").load("/Rental/AllRentals");
    }
</script>

<div id="nav">
    <table width="100%">
        <tr>
            <td width="30%"><span class="create-rental"><a href="#">Add New Rental</a></span></td>
            <td width="30%" align="center"><span class="find-rentals"><a href="#">Find Rentals</a></span></td>
            <td width="30%"></td>
        </tr>
    </table>
</div>
<div id="sidebar-show"><span class="show-option"><a href="#" onclick="toggleSidebar()">Show&nbsp;&raquo;</a></span></div>
<div id="sidebar">
    <div id="create-rental">
        <div id="create-rental-content">
            <script type="text/javascript">
                $("#create-rental-content").load("/Rental/Create");
            </script>
        </div>
    </div>
    <div id="user-rentals">
        <script type="text/javascript">
            $("#user-rentals").load("/Rental/UserList");
        </script>
    </div>
</div>

<div id="all-rentals">
    <script type="text/javascript">
        $("#all-rentals").load("/Rental/AllRentals");
    </script>
</div>

<div id="map"></div>